<template>
  <basic-dialog
    :width="'40%'"
    :visible="visible"
    :title="'取消询价'"
    :ok-text="'提交'"
    :handle-close="onCancel"
    :handle-ok="saveProject"
  >
    <el-form
      class="table_form_wrap"
      ref="quoteForm"
      :model="quoteForm"
      :rules="formValidate"
      label-width="100px"
    >
      <el-col :span="24">
        <el-form-item label="取消原因" prop="expReasonId">
          <el-select
            v-model.trim="quoteForm.expReasonId"
            @change="changeReason"
            placeholder="请选择类型"
          >
            <el-option
              v-for="item in reasonList"
              :key="item.expReasonId"
              :label="item.reason"
              :value="item.expReasonId"
            />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="取消说明" prop="remark">
          <el-input
            v-model.trim="quoteForm.remark"
            placeholder="输入取消说明"
          />
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="提交人" prop="creatorName">
          <el-input v-model="creatorName" disabled placeholder="输入提交人" />
        </el-form-item>
      </el-col>
      <el-col :span="24">
        <el-form-item label="提交时间">
          <el-date-picker
            v-model="abnormaTime"
            type="datetime"
            placeholder="提交时间"
            value-format="yyyy-MM-dd HH:mm:ss"
            disabled
          />
        </el-form-item>
      </el-col>
    </el-form>
  </basic-dialog>
</template>
<script>
import { mapActions } from 'vuex';
import BasicDialog from '../../components/BasicDialog';
import * as Utils from '../utils';
export default {
  components: {
    BasicDialog
  },
  props: {
    setdiolagdata: {
      type: Object,
      required: true
    },
    visible: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
      quoteForm: {
        remark: '',
        reason: '',
        expReasonId: '',
        creator: ''
      },
      creatorName: '',
      abnormaTime: '',
      formValidate: {
        remark: [
          { required: true, message: '请输入取消说明', trigger: 'blur' }
        ],
        expReasonId: [
          { required: true, message: '请选择取消原因', trigger: 'change' }
        ]
      },
      reasonList: []
    };
  },
  mounted () {
    const userInfo = localStorage.userInfo ? JSON.parse(localStorage.userInfo) : {}
    this.creatorName = userInfo?.userName;
    if (this.setdiolagdata.tabtype == 1 || this.setdiolagdata.tabtype == 4) {
      // 询价
      this.reasonList = Utils.ABNORMAL_CAUSE_INQUIRY;
    } else {
      this.reasonList = Utils.ABNORMAL_CAUSE_ORDER;
    }
    let yy = new Date().getFullYear();
    let mm = new Date().getMonth() + 1;
    let dd = new Date().getDate();
    let hh = new Date().getHours();
    let mf =
      new Date().getMinutes() < 10
        ? '0' + new Date().getMinutes()
        : new Date().getMinutes();
    let ss =
      new Date().getSeconds() < 10
        ? '0' + new Date().getSeconds()
        : new Date().getSeconds();
    this.abnormaTime =
      yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf + ':' + ss;
  },
  methods: {
    ...mapActions('sourcing/demandInquery', [
      'expInquiryList', // 采购需求 --询价
      'exceptionOrderGoodsList', // 采购需求 --- 订货
      'cancelOrderList', // 采购询价 --- 订货
      'cancelInquiryList' // 采购询价 ---询价
    ]),
    emptyForm () {
      this.quoteForm = {};
    },
    changeReason (val) {
      this.reasonList.map((item) => {
        if (item.expReasonId === val) {
          this.quoteForm.reason = item.reason;
        }
      });
    },
    onCancel () {
      if (this.$refs.quoteForm) {
        this.$refs.quoteForm.resetFields();
        this.emptyForm();
      }
      this.$emit('update:visible', false);
    },
    saveProject () {
      this.$refs['quoteForm'].validate((valid) => {
        if (valid) {
          let url = '';
          if (this.setdiolagdata.tabtype == 1) {
            // 需求--询价
            url = this.expInquiryList;
          } else if (this.setdiolagdata.tabtype == 2) {
            // 需求--订货
            url = this.exceptionOrderGoodsList;
          } else if (this.setdiolagdata.tabtype == 3) {
            // 采购---订货
            url = this.cancelOrderList;
          } else {
            // 采购 --询价
            url = this.cancelInquiryList;
          }
          if (
            this.setdiolagdata.tabtype == 1 ||
            this.setdiolagdata.tabtype == 2
          ) {
            this.quoteForm.entryIds = this.setdiolagdata.selectionChangeval;
          } else {
            this.quoteForm.sourcingBillId =
              this.setdiolagdata.selectionChangeval;
          }
          const cb = (res) => {
            this.$message.success(res.msg);
            this.onCancel();
            this.$parent.getTableData();
          };
          const data = this.quoteForm;
          url({
            payload: {
              data,
              cb
            }
          });
        }
      });
    }
  }
};
</script>
